<%--
  Created by IntelliJ IDEA.
  User: baobao
  Date: 2016/4/26
  Time: 20:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<!DOCTYPE html>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="from"%>
<html>
<head>
    <meta charset="UTF-8">
    <title><spring:message code="case_design_platform_name"/></title>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/resources/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/resources/easyui/themes/icon.css">
    <script type="text/javascript" src="<%=request.getContextPath() %>/resources/easyui/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath() %>/resources/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath() %>/resources/easyui/locale/easyui-lang-zh_CN.js"></script>
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/resources/style/main.css">
    <link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/resources/style/icon.css">
    <script type="text/javascript">
        var caseTreeData = <%=request.getAttribute("caseData") %>;
        $(function(){
            $('#help_tree').tree({
                checkbox: false,
                animate:true,
                lines:true,
                data: caseTreeData,
                onClick:function(node) {
                    if(node.attributes == "<spring:message code="case_catalog_type"/>"){
                        //edit imgMap or a table
                        $('#show_win').panel('refresh','<%=request.getContextPath() %>/page/showCatalogCases/'+node.id);
                        $('body').layout('panel', 'center').panel('setTitle', node.text);
                    }else if(node.attributes == "<spring:message code="case_data_type"/>"){
                        //edit case's data
                        $('#show_win').panel('refresh','<%=request.getContextPath() %>/page/caseData-design/'+node.id);
                        $('body').layout('panel', 'center').panel('setTitle', node.text);
                    }else if(node.attributes == "<spring:message code="schema_database_type"/>"){
                        $('#show_win').panel('refresh','<%=request.getContextPath() %>/page/showDataBaseCases/'+node.id);
                        $('body').layout('panel', 'center').panel('setTitle', node.text);
                    }

                },
                formatter: function(node) {
                    return node.text + "-";
                }
            });
            $('#show_win').panel({
                fit:true,
                border:false,
                noheader:false
            });
        });
    </script>
</head>
<body class="easyui-layout">
<div data-options="region:'north'" style="height:69px;overflow:hidden;">
 <!--   <table style="background:url('resources/images/utitle.png');
    background-position: center center;  background-repeat: repeat;"
           width=100% border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td width="1%"></td>
            <td width=3% valign="center" ><img src="resources/images/ulogo.png" width="40" height=40" /></td>
            <td width=85% valign="top" align="left">
                <div align="justify" >
                    <p style="font-size:24px;font-family:黑体; font-weight: bold"><spring:message code="case_design_platform_name"/></p>
                </div></td>
            <td width=10% valign="middle" class="STYLE4">
                <div align="justify" >
                    <TextBox style="font-weight: bold; font-size: 14px; font-family: 黑体">
                        <spring:message code="case_design_welcome"/>${currentUser.userName}
                    </TextBox>
                    <a  href="<%=request.getContextPath() %>/logout"><img src="resources/images/exit.png" width="17" height="17"/></a>
                </div>
            </td>
        </tr>
    </table>//-->
    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
        <tbody><tr>
            <td width="170" align="left"><div style="width:100%; height:69px; BACKGROUND-IMAGE: url(resources/images/ulogo.png);opacity:0.4;BACKGROUND-POSITION: left center; BACKGROUND-REPEAT: no-repeat;"></div></td>
            <td width="490" align="left"><div style="width:100%; height:69px; BACKGROUND-IMAGE: url(resources/images/case-design-top.png);BACKGROUND-POSITION: left center; BACKGROUND-REPEAT: no-repeat;"></div></td>
            <td align="right">
                <div style="text-align:right; width:100%; height:68px; BACKGROUND-IMAGE: url(resources/images/topright.png);BACKGROUND-POSITION: right center; BACKGROUND-REPEAT: no-repeat; float: right">
                    <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
                        <tbody><tr>
                            <td id="task1" rowspan="1" valign="bottom">&nbsp;</td>
                            <td width="150"><TextBox style="font-weight: bold; font-size: 14px; font-family: 黑体"><spring:message code="case_design_welcome"/>${currentUser.userName}</TextBox></td>
                            <td width="55"><a  href="<%=request.getContextPath() %>/logout"><img src="resources/images/exit.png" width="17" height="17"/></a>
                            </td>
                            <td width="55">&nbsp;
                            </td>
                        </tr>
                    </tbody></table>
                </div>
            </td>
        </tr>
    </tbody></table>
</div>

<div data-options="region:'west',split:true,title:'<spring:message code="case_design_accordion_title"/>',iconCls:'icon-help'" style="width:280px;padding:5px; text-align:left;">
    <div id="rolelist_dg_toolbar" style="position: fixed;top: 100px;background: white;height: 22px;width: 200px;z-index:10;">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newCase()"><spring:message code="case_design_node_add"/></a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editCase()"><spring:message code="case_design_node_edit"/></a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="deleteCase()"><spring:message code="case_design_node_delete"/></a>
    </div>
    <div style="position: relative;top:22px;z-index: 9"><ul id="help_tree" class="easyui-tree"></ul></div>
    <div id="catalog_save_dialog" class="easyui-dialog" style="width:400px;height:280px;padding:10px 20px"
         closed="true" buttons="#catalog_save_dialog_buttons" modal="true">
        <div class="ftitle"><spring:message code="case_design_input_node_info"/> </div>
        <div id="catalog_info_form">
            <div class="fitem">
                <label><spring:message code="case_design_node_name"/> </label>
                <input type="text" name="nodeName" required="true"/>
            </div>
            <div id="parentListType0" class="fitem" type="category">
                <label><spring:message code="case_design_node_type"/></label>
                <select class="easyui-combobox" name="catalogType"  id="catalogList">
                    <option value="<spring:message code="case_catalog_type"/>" selected><spring:message code="case_catalog"/></option>
                    <option value="<spring:message code="case_data_type"/>" ><spring:message code="case"/></option>
                </select>
            </div>
        </div>
        <div id="#catalog_save_dialog_buttons">
            <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveCase()"><spring:message code="case_design_save"/> </a>
            <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#catalog_save_dialog').dialog('close')"><spring:message code="case_design_cancel"/> </a>
        </div>
    </div>

</div>
<div data-options="region:'center'" title="<spring:message code='main_win_name'/>" style=" padding:10px; text-align:left;">
    <div id="show_win" class="side_win"></div>
</div>

<script type="text/javascript">
    setInterval(function() {
        var url = '<%=request.getContextPath() %>/checkSession';
        $.get(url, function(result) {
            if (!result.successful) {
                window.location.href="<%=request.getContextPath() %>";
            }
        }, 'json');
    }, 60000);

    var caseUrl={
        caseAdd:'<%=request.getContextPath() %>/case/add',
        caseUpdate:'<%=request.getContextPath() %>/case/update',
        caseDelete:'<%=request.getContextPath() %>/case/delete'
    };
    var url;

    //记录当前选中的节点id
    var caseId;
    var caseType;
    var caseName;
    $('#help_tree').tree({
        onSelect: function (node) {
            caseId = node.id;
            caseType = node.attributes;
            caseName = node.text;
        }
    });

    function newCase(){
        var node=$('#help_tree').tree('getSelected');
        if(node){
            if(node.attributes == "<spring:message code="case_data_type"/>" || node.attributes == "<spring:message code="schema_catalog_type"/>" || node.attributes == "0"){
                $.messager.alert("<spring:message code="warning_title1"/>", "<spring:message code="warning_content1"/>", "warning");
                return;
            }
            $('#catalog_save_dialog').dialog('open').dialog('setTitle',"<spring:message code="addCase_diaglog_title"/>");
            $('#parentListType0').show();
            $('#catalog_info_form').form('clear');
            //默认是选择实例
            $('#catalogList').combobox('select',<spring:message code="case_data_type"/>);
            url=caseUrl.caseAdd;
        }else{
            if(!isTreeEmpty())
                $.messager.alert("<spring:message code="warning_title2"/>", "<spring:message code="warning_content2"/>","warning");
            else{
                $.messager.alert("<spring:message code="warning_title_no_database"/>", "<spring:message code="warning_content_no_database"/>","warning");
            }
        }
    }

    function isTreeEmpty(){
        var root = $('#help_tree').tree('getRoot');
        return root == null;
    }

    function editCase(){
        var node=$('#help_tree').tree('getSelected');
        if(node){
            if(node.attributes == "<spring:message code="schema_catalog_type"/>" || node.attributes == "<spring:message code="schema_database_type"/>"){
                $.messager.alert("<spring:message code="warning_title_no_authority"/>", "<spring:message code="warning_content_no_authority"/>","warning");
                return;
            }
            $("input[name='nodeName']").prop('value',node.text);
            $('#parentListType0').hide();
            $('#catalog_save_dialog').dialog('open').dialog('setTitle',"<spring:message code="editCase_diaglog_title"/>");
            url=caseUrl.caseUpdate;
        }else{
            if(!isTreeEmpty())
                $.messager.alert("<spring:message code="warning_title2"/>", "<spring:message code="warning_content2"/>","warning");
            else
                $.messager.alert("<spring:message code="warning_title_no_database"/>", "<spring:message code="warning_content_no_database"/>","warning");
        }
    }

    function deleteCase(){
        var node=$('#help_tree').tree('getSelected');
        var pid=node.parentId;
        if(node){
            if(node.attributes == "<spring:message code="schema_catalog_type"/>" || node.attributes == "<spring:message code="schema_database_type"/>"){
                $.messager.alert("<spring:message code="warning_title_no_authority"/>", "<spring:message code="warning_content_no_authority"/>","warning");
                return;
            }
            $.messager.confirm('Confirm', '<spring:message code="tips_delete"/>', function (n) {
                if (n) {
                    $.post(caseUrl.caseDelete, {id: node.id}, function (result) {
                        if(result.successful) {
                            $("#help_tree").tree("remove", node.target);
                            if(node.attributes == "<spring:message code="case_catalog_type"/>"){
                                //edit imgMap or a table
                                $('#show_win').panel('refresh','<%=request.getContextPath() %>/page/showCatalogCases/'+node.id);
                            }else if(node.attributes == "<spring:message code="case_data_type"/>"){
                                //edit case's data
                                //$('#show_win').panel('refresh','<%=request.getContextPath() %>/page/caseData-design/'+node.id);
                            }else if(node.attributes == "<spring:message code="schema_database_type"/>"){
                                $('#show_win').panel('refresh','<%=request.getContextPath() %>/page/showDataBaseCases/'+node.id);
                            }
                        }
                        $.messager.show({title: '操作结果', msg: result.message});
                    })
                }
            });
        }else{
            if(!isTreeEmpty())
                $.messager.alert("<spring:message code="operation_tips"/>","<spring:message code="tips_two"/> ","warning");
            $.messager.alert("<spring:message code="operation_tips"/>","<spring:message code="tips_one"/> ","warning");
        }
    }

    function saveCase(){
        var node=$('#help_tree').tree('getSelected');
        var name=$("input[name='nodeName']")[0].value;
        var pid;
        if(name=="" || name==null){
            $.messager.alert("操作提示","节点名称不能为空","warning");
            return false;
        }
        //空树 创建根节点
        if(node == null)
            pid = 0;
        else
            pid = node.id;
        if(url==caseUrl.caseAdd) {
            var type = $(".fitem[type='category'][style!='display: none;'] .combo-value")[0].value;
            type=parseInt(type);

        }
        else if(url == caseUrl.caseUpdate) {
            var type = node.attributes;
            type=parseInt(type);
        }
        var data={name:name,parentId:pid,type:type};
        if(url == caseUrl.caseUpdate) {
            data.id = node.id;
        }
        if(url == caseUrl.caseAdd && node.attributes=="<spring:message code="schema_database_type"/>") {
            var schemaId = node.id;
            data = {name: name, parentId: pid, type: type, schemaId: schemaId};
        }
        $.get(url,data,function(result){
            result = eval(result);
            if(result.successful){
                $('#catalog_save_dialog').dialog('close');
                if(url==caseUrl.caseAdd) {
                    var nodeData = {id: result.data, text: data.name, attributes: type, parentId: pid};
                    if (type == <spring:message code="case_catalog_type"/>) {
                        nodeData.iconCls = "<spring:message code="case_catalog_icon"/>";
                    } else if (type == <spring:message code="case_data_type"/>){
                        nodeData.iconCls = "<spring:message code="case_data_icon"/>";
                    }
                    $("#help_tree").tree("append",{
                        parent:node.target,
                        data:[nodeData]
                    });
                }else if(url == caseUrl.caseUpdate){
                    node.text=data.name;
                    $("#help_tree").tree("update",node);
                }
                $.messager.show({title:'操作结果',msg:result.message});
            }else{
                if(url==caseUrl.caseAdd || url == caseUrl.caseUpdate){
                    $.messager.show({title:'操作结果',msg:result.message});
                    $('#catalog_save_dialog').dialog('close');
                }else
                    $.messager.show({title:'操作结果',msg:result.data});
            }
        });
    }

</script>

</body>
</html>
